<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <link rel="stylesheet" href="stylesheets/zui.min.css"/>
    <link rel="stylesheet" href="stylesheets/main.css" id="css"/>
    <script src="javascripts/jquery-1.10.1.min.js"></script>
    <script src="javascripts/footer.js"></script>
    <script src="javascripts/replayCode.js"></script>
    <title>斯迈普解盘侠</title>
    <style type="text/css">
    	.getCodeButton {
    		border:0px;
    		width:100%;
    		height:100%;
    		text-align:center;
    		background-color:#e24344;
    		color:white;
    	}
    </style>
    <script type="text/javascript">
        var c ;
    	$(function(){
    		//验证码
	    	var a = parseInt(Math.random()*10) ;
	    	var b = parseInt(Math.random()*10) ;
	    	c = a +b;
	    	$('#code').html(a + '+' + b + '=?');	
    		var timeout = false; //启动及关闭按钮  
    		
    		var showMsgFun = function(msg){
    			$('.pageMsg').text(msg);
    		};
    		
    		var myTimerFun = function(totalTime,callback){
    			var s = totalTime;
    			var time = function(){
    				if(timeout){
 					   return;  
 				   }
 				   if(callback(s)){
 					   return;
 				   }
 				  s--;
 					setTimeout(time,1000); //time是指本身,延时递归调用自己,100为间隔调用时间,单位毫秒  
    			};
    			time();
    		};
    		/**
    			绑定发送手机短信验证码事件
    		*/
    		$('#getCodeBtn').click(function(){
    			var $getCodeBtn = $(this);
    			var mphone = $('input[name="mphone"]').val();
    			if(!/^[0-9]{11}$/.test(mphone)){
    				showMsgFun('请输入手机号码');
    				return;
    			}
    			/* var r = $('#numCode').val();
    			if(r != c){
    				showMsgFun('请输入正确的答案');
    				return;
    			} */
    			showMsgFun('');
    			$.ajax({
    				url:'../member/pwd/sendSMS.do',
    				type:'post',
    				dataType:'json',
    				data:{
    					mphone:mphone
    				},
    				success:function(d){
    					if(d.success){
							$getCodeBtn.attr('disabled','disabled');
    						myTimerFun(60,function(t){
    							 if(t != -1){
      							   //showMsgFun('发送成功，'+t+'秒后重新发送');
      							   $getCodeBtn.text(t + '秒后重新发送').css({color:'#666666'});
      							   return false;
  	  							} else {
  	  								$getCodeBtn.removeAttr('disabled').text('重新获取').css({color:'white'});
  	  								//showMsgFun('如果未收到短信，请尝试重新获取。');
  	  								return true;
  	  							}
    						});
    						
    					}
    				}
    			});
    		});
    		
    		var submitFun = function(){
    			var mphone = $('input[name="mphone"]').val();
    			var validCode = $('input[name="validCode"]').val();
    			var pwd = $('input[name="pwd"]').val();
    			var repwd = $('input[name="repwd"]').val();
    			
    			if($.trim(mphone) == ''){
    				showMsgFun('手机号码不能为空！');
    				return;	
    			}
    			if($.trim(validCode) == '') {
    				showMsgFun('验证码不能为空！');
    				return;
    			}
    			if(pwd == '' || repwd == ''){
    				showMsgFun('密码或确认密码不能为空！');
    				return;
    			}
    			if(pwd != repwd){
    				showMsgFun('两次密码不一致！');
    				return ;
    			}
    			
    			$.ajax({
    				url:'../member/pwd/modify.do',
    				type:'post',
    				dataType:'json',
    				data:{
    					mphone:mphone,smsCode:validCode,pwd:pwd
    				},
    				success:function(d){
    					if(d.success){
    						timeout = true;//该变量可以控制发送短信按钮下的定时任务
    						
    						showMsgFun('修改成功，等待跳转...');
    						setTimeout(function(){
    							window.location.href = 'login.html?redirectUrl=index.html';
    						},3000);
    					} else {
    						showMsgFun(replayCode[d.statusCode]);
    					}
    				}
    			});
    		};
    		
    		/**
    			绑定保存按钮事件
    		*/
    		$('.submitBtn').click(function(){
    			submitFun();
    		});
    	});
    </script>
</head>
<body class="index">
<div class="container main">
    <div class="row find-pwd-box bottom-border">
                <div class="col-xs-4 right-border">
                    <div class="tab-c-tab">
                        <div class="tab-c-cell">
                            <span>账户</span>
                        </div>
                    </div>
                </div>
                <div class="col-xs-8">
                    <div class="tab-c-tab">
                        <div class="tab-c-cell">
                            <input type="text" name="mphone" placeholder="请输入您的手机号"/>
                        </div>
                    </div>
                </div>
    </div>
    
  <!--   <div class="row find-pwd-box bottom-border">
        <div class="col-xs-4 right-border">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <span id="code" style="color: firebrick;"></span>
                </div>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <input type="text" id='numCode' name="numCode" placeholder="请填入正确的答案"/>
                </div>
            </div>
        </div>
        
    </div> -->
    
    <div class="row find-pwd-box clear-mar-top">
        <div class="col-xs-4 right-border">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <span>验证码</span>
                </div>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <input type="text" name="validCode" placeholder="验证码"/>
                </div>
            </div>
        </div>
        <div class="col-xs-4 clear-padding send-code-box" >
            <div class="tab-c-tab">
                <div class="tab-c-cell">
<!--                     <span class="sendSMSValidCode">发送验证码</span> -->
                    <button id="getCodeBtn" class="getCodeButton">发送验证码</button>
                </div>
            </div>
        </div>
    </div>

    <div class="row find-pwd-box bottom-border">
        <div class="col-xs-4 right-border">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <span>密码</span>
                </div>
            </div>
        </div>
        <div class="col-xs-8">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <input type="password" name="pwd" placeholder="新密码"/>
                </div>
            </div>
        </div>
    </div>
    <div class="row find-pwd-box bottom-border clear-mar-top">
        <div class="col-xs-4 right-border">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <span>确认密码</span>
                </div>
            </div>
        </div>
        <div class="col-xs-8">
            <div class="tab-c-tab">
                <div class="tab-c-cell">
                    <input type="password" name="repwd" placeholder="新密码"/>
                </div>
            </div>
        </div>
    </div>

    <div class="row login-btn-box">
        <div class="col-xs-12">
            <button class="btn btn-danger submitBtn">保存</button>
        </div>
    </div>
    <div class="row login-btn-box">
        <label class="pageMsg"></label>
    </div>

    <footer class="nav-footer">
			<div class="col-xs-3" id="hall" >
				<i class="icon icon-home"></i>
				<h4>解盘</h4>
			</div>
			<div class="col-xs-3" id="notify"  >
				<i class="icon icon-volume-up"></i>
				<h4>喊单</h4>
			</div>
			<div class="col-xs-3" id= "news" >
				<i class="icon icon-globe"></i>
				<h4>资讯</h4>
			</div>
			<div class="col-xs-3  footer-nav-active" id="my" >
				<i class="icon icon-user"></i>
				<h4>个人中心</h4>
			</div>
</footer>
</div>
<script src="javascripts/main.js"></script>
</body>
</html>